<!-- 购物车商品卡片 -->
<template>
    <view class="cardBox">
        <u--image width="180rpx" height="180rpx" :src="item.img" mode="widthFix" />
		<view class="infoBox">
			<view class="titleBox">
                <view class="title">
                    {{item.storeName}}
                </view>
				<view class="QHJ">
				    券后价
				</view>
			</view>
			<view class="sallBox">
				<view class="priceBox">
					<view class="nowPrice">
						<text class="unit">￥</text>
						<text class="money">{{item.price}}</text>
					</view>
                    <view class="oldPrice">
                    	<text class="unit">￥</text>
                    	<text class="money">{{item.price}}</text>
                    </view>
                    <view class="numBox">
                    	<text class="unit">X</text>
                    	<text class="num">{{item.buyCarNum}}</text>
                    </view>
				</view>
			</view>
		</view>
    </view>
</template>

<script>
    export default {
        name:"productCard",
		props: {
			item: Object
		},
        data() {
            return {
                
            };
        },
		methods: {
			
		}
    }
</script>

<style lang="scss" scoped>
	.cardBox {
        padding: 10rpx 0;
		display: flex;
        align-items: center;
        .check {
            margin-right: 30rpx;
        }
		.infoBox {
            flex: 1;
			margin-left: 20rpx;
            display: flex;
            justify-content: space-between;
            .titleBox {
                display: inline-block;
                margin-right: 50rpx;
                .title {
                    margin-bottom: 30rpx;
                	font-size: 28rpx;
                	color: $uni-text-color-grey-6;
                	overflow: hidden;
                	text-overflow: ellipsis;
                	display: -webkit-box;
                	-webkit-box-orient: vertical;
                	-webkit-line-clamp: 2;
                }
                .QHJ {
                    display: inline;
                    border-radius: $uni-border-radius-sm;
                    border: 1rpx solid $uni-color-warning;
                    font-size: 28rpx;
                    color: $uni-color-warning;
                }
            }
			.sallBox {
				margin-top: 20rpx;
				display: flex;
				justify-content: space-between;
				.priceBox {
                    text-align: right;
					.nowPrice {
						color: $uni-text-color-money;
						font-weight: bold;
						.unit {
							font-family: DIN Alternate, DIN Alternate;
							font-size: 24rpx;
						}
						.money {
							font-family: DIN Alternate, DIN Alternate;
							font-size: 36rpx;
						}
					}
					.oldPrice {
						color: $uni-text-color-grey-9;
						font-weight: bold;
						font-family: DIN Alternate, DIN Alternate;
						font-size: 28rpx;
                        text-decoration: line-through;
					}
                    .numBox {
                        font-size: 28rpx;
                        color: $uni-text-color-grey-9;
                    }
				}
				
				.iconBox{
					margin-right: 20rpx;
					position: relative;
				}
			}
		}
	}
</style>